<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>百商汇</title>
	<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0,minimum-scale = 1.0,user-scalable = no,width = device-width">
	<meta name="format-detection" content="telephone=no" />
	<link rel="stylesheet" type="text/css" href="../csses/register.css">
</head>
<body>
	<div class="register_title">
		注册
		<img src="../image/back.png" onclick="goBack()" class="back">
	</div>
	<div class="register_box">
		<ul>
			<li>
				<span>手机号码</span>
				<input type="text" placeholder="请输入11位手机号" class="telNum"></input>
			</li>
			<li style="position: relative;" id="testPic">
				<span>图片验证</span>
				<input type="text" placeholder="请输入图片验证码" class="testPic"></input>
				<img id="pic">
			</li>
			<li>
				<span>短信验证</span>
				<input type="text" placeholder="请输入短信验证码" class="testMessage" style="width: 3.9rem;"></input>
				<button class="getMessage">获取验证码</button>
			</li>
			<li>
				<span>登录密码</span>
				<input type="password" placeholder="请输入登录密码，默认为支付密码" class="password"></input>
			</li>
			<li>
				<span>推 &nbsp;荐 &nbsp;人</span>
				<input type="text" placeholder="请输入推荐人手机号，可不填" class="recommendNum"></input>
			</li>
		</ul>
		<input type="hidden" class="wxUnionId" name="wxUnionId" value="${ wxUnionId }" />
		<p class="agreement">注册表示同意<a href="registerAgree.html">《用户协议》</a></p>

		<button class="submitBtn">注册</button>

		<div class="remindBox"></div>
	</div>


	<script type="text/javascript" src="../lib/flexible.js"></script>
	<script type="text/javascript" src="../lib/jquery-1.10.1.min.js"></script>
	<script type="text/javascript" src="../lib/des3.js"></script>
	<script type="text/javascript">
		function goBack(){
			window.history.back();
		}

		$('ul li input').focus(function(){
			this.select();
		});

		var IntervalObj,count = 60,curCount;
		function SetRemindTime(){
			if(curCount == 1){
				window.clearInterval(IntervalObj);
				$('.getMessage').text('获取短信验证码');
				$('.getMessage').css('color','#dc4b19');
				
			}else{
				curCount--;
				$('.getMessage').text('剩余' + curCount + '秒');
				$('.getMessage').css('color','#ccc');
				$('.getMessage').attr('disabled','true');
			}
		}

		function getPic () {
	        $.ajax({
	            type : 'post',
	            url : '/api/v1/sms/getUuid',
	            data : {
	                paramStr : "{'type':'" + 'register' + "','remark':'" + "" + "'}"
	            },
	            dataType : 'json',
	            timeout : 10000,
	            success : function (data) {
	            	if(data.code == 200){
		                var obj = JSON.parse(data.data);
		                var picUrl = obj.verifyInfo.picUrl;
		                var uuid = obj.verifyInfo.uuid;
		                sessionStorage.uuid = uuid;
		                sessionStorage.picUrl = picUrl;
		                $('#pic').attr('src',sessionStorage.picUrl);
	                }
	            },
	            error : function (xhr,type,errorThrown) {
	                
	            }
	        });
	    }
	    getPic();

		function remind(message){
			$('.remindBox').css('display','block').text(message);
			setTimeout(function(){
				$('.remindBox').css('display','none');
			},1500);
		}

		new_element = document.createElement("script");
		new_element.setAttribute("type", "text/javascript");
		new_element.setAttribute("src", "../lib/des3.js"); // 在这里引入了a.js
		document.body.appendChild(new_element);
		
		$('.getMessage').click(function() {
			var telNum = document.querySelector(".telNum").value;
			var verifyCode = document.querySelector('.testPic').value;
	        verifyCode = verifyCode == null ? null : verifyCode;
			var reg1 = /(^1[3|4|5|7|8][0-9]{9}$)/;
			if(reg1.test(telNum) == false) {
				remind('请输入正确的手机号码');
			}else{
				$.ajax({
					type: 'post',
					url : "/api/v1/sms/send",
					data: {
						paramStr: DES3.encrypt("{'mobile':'"+ telNum + "','type':'" + "register" + "','uuid':'" + sessionStorage.uuid + "','verifyCode':'" + verifyCode +"'}")
					},
					dataType: 'json',
					timeout : 10000,
					success: function(data) {
						if(data.code == 200){
							curCount = count;
							IntervalObj = window.setInterval(SetRemindTime,1000);
						}else if(data.code == 108){
							$('#testPic').css('display','block');
							getPic();
							$('#pic').click(function(){
				                getPic();
				            });
						}
						remind(data.message);
					},
					error: function(xhr, type, errorThrown) {
						alert('111');
					}
				});
			}
		});
		//获取验证码
		
		$('.submitBtn').click(function() {
			var telNum = document.querySelector(".telNum").value;
			var password = document.querySelector(".password").value;
			var reg1 = /(^1[3|4|5|7|8][0-9]{9}$)/;
			var reg2 = /^[0-9A-Za-z]{6,}$/;
			var recommendNum = document.querySelector(".recommendNum").value;
			var testMessage = document.querySelector(".testMessage").value;
			var wxUnionId = document.querySelector(".wxUnionId").value;
			if(reg1.test(telNum) == false) {
				remind("请输入正确的手机号码");
			}else if(reg2.test(password) == false) {
				remind("请输入6位以上密码");
			}else{
				$.ajax({
					type: 'post',
					url : "/api/v1/user/register",
					data: {
						paramStr: "{'userName':'" + telNum + "','appVer':'h5','password':'" + password + "','mobile':'" + telNum + "','pMobile':'" + recommendNum + "','smsVerifyCode':'" + testMessage + "','wxUnionId':'"+wxUnionId+"'}"
					},
					dataType: 'json',
					timeout : 10000,
					success : function(data) {
						if(data.code == 200) {
							$('.submitBtn').attr('disabled',true).css('background','#ccc');
							setTimeout(function() {
								window.location.href = '../index1.html';
							},1500);
						}
						remind(data.message);
					},
					error : function(xhr , type , errorThrown) {
						//异常处理；
						alert("未知错误");
					}
				});
			}
		});
	</script>
	<!--<script>
		var fn = function(){
			var dpr = window.devicePixelRatio;
			var scale= 1/dpr;
			var html = document.getElementsByTagName();
			var meta = document.getElementById('vp');
			html.style.fontSize = innerWidth/10 +'px';
			html.setAttribute('data-dpr',dpr);
			meta.setAttribute('content','initial-scale='+scale+',maximun-scale = '+scale+',minimum-scale='+scale+',user-scalable=no,width = device-width')
		}
		fn();
		window.onresize = fn;
	</script>-->
</body>
</html>